// carPackage/pages/clipperImg/clipperImg.js
import { uploadOSSActicon } from '../../../service/upload_service'

const app = getApp()
Page({

  /**
   * 页面的初始数据
   */
  data: {
    src: '',
    width: 375, //宽度
    height: 500, //高度
    max_width: 300,
    max_height: 300,
    disable_rotate: true, //是否禁用旋转
    disable_ratio: false, //锁定比例
    limit_move: true, //是否限制移动
    qiniuVinImg: "",//车架号图片
    specVinNumber: "",//vinNumber
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    this.cropper = this.selectComponent("#image-cropper");
    this.setData({
      src: options.imgSrc
    });
    if (!options.imgSrc) {
      setTimeout(() => {
        this.upload(); //上传图片
      }, 500)

    }
  },



  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function () {

  },

  cropperload(e) {
    console.log('cropper加载完成');
  },
  loadimage(e) {
    wx.hideLoading();
    console.log('图片');
    this.cropper.imgReset();
  },
  clickcut(e) {
    console.log(e.detail);
    //图片预览
    wx.previewImage({
      current: e.detail.url, // 当前显示图片的http链接
      urls: [e.detail.url] // 需要预览的图片http链接列表
    })
  },
  rotate() {
    if (!this.data.src) {
      wx.showToast({
        title: '请先上传车架号图片',
        icon: "none"
      })
      return;
    }
    //在用户旋转的基础上旋转90°
    this.cropper.setAngle(this.cropper.data.angle += 90);
  },
  upload() {
    let that = this;
    wx.chooseImage({
      count: 1,
      sizeType: ['original', 'compressed'],
      sourceType: ['album', 'camera'],
      success(res) {
        wx.showLoading({
          title: '加载中',
        })
        const tempFilePaths = res.tempFilePaths[0];
        //重置图片角度、缩放、位置
        that.cropper.imgReset();
        that.setData({
          src: tempFilePaths
        });
      }
    })
  },
  //开始识别
  submit() {
    if (!this.data.src) {
      wx.showToast({
        title: '请先上传头像图片',
        icon: "none"
      })
      return;
    }
    this.cropper.getImg((obj) => {
      this.pushImgToQiniu(obj.url)
      // app.globalData.clipperImg = obj.url;
      // app.globalData.isClipper = true;
      // wx.navigateBack({
      //   delta: 0,
      // })
    });
  },

  //上传车架号到七牛;
  pushImgToQiniu(imgUrl) {
    wx.showLoading({
      title: '图片上传中',
    })
    uploadOSSActicon(imgUrl, "avatar").then(res => {
      console.log("JJLog:图片上传结果是:" + JSON.stringify(res));
      wx.hideLoading()
      this.setData({
        qiniuVinImg: res.data.filename
      })
      app.globalData.cropperAvatar = res.data.filename
      wx.navigateBack();

    }).catch(err => {
      wx.hideLoading();
      wx.showToast({
        title: '图片上传失败',
        icon: "none"
      })
      console.error("JJLog:uploadOSSActicon", err);
    })
  },
  //识别车架号
  recognitionImgByUrl() {
    // wx.showLoading({
    //   title: '识别中...',
    // })
    // queryVinNumberByImg(this.data.qiniuVinImg).then(res => {
    //   wx.hideLoading();
    //   console.log("JJLog:识别车架成功:" + JSON.stringify(res));
    //   if (res.code == 0) {

    //     this.setData({
    //       specVinNumber: res.data
    //     })
    //     if (res.data) {
    //       wx.showToast({
    //         title: '识别车架号成功',
    //         icon: "success"
    //       })
    //       setTimeout(() => {
    //         app.globalData.clipperImg = this.data.qiniuVinImg;
    //         app.globalData.isClipper = true;
    //         app.globalData.vinNumber = res.data
    //         wx.navigateTo({
    //           url: '/carPackage/pages/vinSurePage/vinSurePage',
    //         })
    //       }, 2000);
    //     }

    //   }
    // }).catch(err => {
    //   console.error("JJLog:识别失败:", err);
    //   wx.hideLoading();
    //   wx.showToast({
    //     title: err || "暂未识别到车架号，请重新上传图片",
    //     icon: "none"
    //   })
    //   setTimeout(() => {
    //     app.globalData.discernFail = true;
    //     app.globalData.clipperImg = this.data.qiniuVinImg;
    //     wx.navigateBack({
    //       delta: 0,
    //     })
    //   }, 2000);
    // })
  },

  top() {
    this.data.top = setInterval(() => {
      this.cropper.setTransform({
        y: -3
      });
    }, 1000 / 60)
  },
  bottom() {
    this.data.bottom = setInterval(() => {
      this.cropper.setTransform({
        y: 3
      });
    }, 1000 / 60)
  },
  left() {
    this.data.left = setInterval(() => {
      this.cropper.setTransform({
        x: -3
      });
    }, 1000 / 60)
  },
  right() {
    this.data.right = setInterval(() => {
      this.cropper.setTransform({
        x: 3
      });
    }, 1000 / 60)
  },
  narrow() {
    this.data.narrow = setInterval(() => {
      this.cropper.setTransform({
        scale: -0.02
      });
    }, 1000 / 60)
  },
  enlarge() {
    this.data.enlarge = setInterval(() => {
      this.cropper.setTransform({
        scale: 0.02
      });
    }, 1000 / 60)
  },
  end(e) {
    clearInterval(this.data[e.currentTarget.dataset.type]);
  },
})